import 'dart:ui';

import 'package:buy_flutter/common/Application.dart';
import 'package:buy_flutter/router/routes.dart';
import 'package:buy_flutter/widgets/common_tabbar_widget.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:fluttertoast/fluttertoast.dart';

class LoginPage extends StatelessWidget {
  String inpuPhone = "";

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      resizeToAvoidBottomInset: false,
      appBar: CommonTabbarContainerWidget(
        titleName: "登入啟蒙學習系統",
        buildContext: context,
      ),
      body: Container(
        padding: EdgeInsets.all(25),
        child: Column(
          children: [
            _topTips(),
            _inputForm(),
            Align(
              alignment: Alignment.topRight,
              child: _loginButton(context),
            )
          ],
        ),
      ),
    );
  }

  Widget _loginButton(BuildContext context) {
    return RaisedButton(
      onPressed: () {
        print("inpuPhone====>"+inpuPhone);
        if (inpuPhone.isNotEmpty && inpuPhone.length > 0) {
          Application.router
              .navigateTo(context, Routes.loginSmsCode + "?phone=$inpuPhone");
        } else {
          Fluttertoast.showToast(msg: "请输入正确的手机号");
        }
      },
      child: Text("确认"),
      textColor: Colors.white,
      color: Color(0xFF58C7B7),
    );
  }

  Widget _topTips() {
    return Column(
      children: [
        Image.asset(
          "assets/login/ic_input_mobile_top.png",
          height: 100,
        ),
        Text(
          "確認您輸入的電話號碼",
          style: TextStyle(color: Colors.black, fontSize: 28),
        ),
        SizedBox(
          height: 10,
        ),
        Text(
          "啟用後產品將會跟您的電話號碼連結",
          style: TextStyle(color: Color(0xFF595959), fontSize: 16),
        ),
        Text(
          "* 連結後並不可以修改",
          style: TextStyle(color: Color(0xFF9124A3), fontSize: 16),
        ),
      ],
    );
  }

  Widget _inputForm() {
    return Container(
      margin: EdgeInsets.symmetric(vertical: 20),
      child: Row(
        children: [
          Container(
            alignment: Alignment.center,
            height: 50,
            width: 70,
            decoration: BoxDecoration(
              border: Border.all(color: Color(0xFFECEDED), width: 1),
              borderRadius: BorderRadius.only(
                topLeft: Radius.circular(5),
                bottomLeft: Radius.circular(5),
              ),
            ),
            child: Text(
              "+86",
              style: TextStyle(
                color: Color(0xFF00AF96),
                fontSize: 20,
              ),
            ),
          ),
          Expanded(
              child: Container(
                  padding: EdgeInsets.symmetric(horizontal: 8),
                  height: 50,
                  decoration: BoxDecoration(
                    border: Border.all(color: Color(0xFFECEDED), width: 1),
                    borderRadius: BorderRadius.only(
                      topRight: Radius.circular(5),
                      bottomRight: Radius.circular(5),
                    ),
                  ),
                  child: TextField(
                    keyboardType: TextInputType.number,
                    inputFormatters: [
                      FilteringTextInputFormatter.digitsOnly
                    ],
                    onChanged: (content) {
                      this.inpuPhone = content;
                    },
                    style: TextStyle(
                      color: Color(0xFF00AF96),
                      fontSize: 20,
                    ),
                    textAlign: TextAlign.justify,
                    decoration: InputDecoration(
                      contentPadding: EdgeInsets.all(0),
                      border: InputBorder.none,
                    ),
                  )))
        ],
      ),
    );
  }
}
